import React,{useEffect,useState,useMemo} from 'react'
import {Space,Button,Checkbox} from 'antd'
import store from './store'

export default function Footer() {
 
  let [todolist,setTodolist] = useState(store.getState().todolist)

  useEffect(()=>{
    store.subscribe(()=>{
      //跟新视图
      setTodolist(store.getState().todolist)
    })
  },[])

  //在组件销毁的时候 清除subscribe监听
/*   useEffect(()=>{
    return ()=>{
      unsubscribe()
    }
  }) */

  return (
    <div>
     <Space>
     <Checkbox checked={1} onChange={()=>{
   
     }}>全选</Checkbox>
     <span>选择个数:{10}</span>
     <span>共个数:{todolist.length}</span>
     <Button onClick={()=>{
      
     }}>清除已完成</Button>
     </Space>
    </div>
  )
}
